<template>
  <div class="customer-setting-container">
    <!-- 客户状态&客户集团 -->
    <fieldTree :field-items="normalItems" :default-expanded-keys="defaultExpandedKeys" @getData="getData" />
    <!-- 客户等级 -->
    <CustomerLevel :field-items="levelItems" :default-expanded-keys="defaultExpandedKeys" @getData="getData"/>
    <!-- 外采额度配置 -->
    <ExternalHarvestModule />
  </div>
</template>

<script>
import fieldTree from '@/components/SettingPage/fieldTree';
import CustomerLevel from '@/components/SettingPage/customerLevel';
import ExternalHarvestModule from './externalHarvestModule';

export default {
  components: { CustomerLevel, fieldTree, ExternalHarvestModule },
  props: {
    fieldItems: {
      type: Array,
      default: () => {
        return [];
      }
    },
    defaultExpandedKeys: {
      type: Array,
      default: () => {
        return [];
      }
    }
  },
  computed: {
    // 客户状态和客户集团
    normalItems() {
      return this.fieldItems.filter(i => [4, 27].includes(i.id));
    },
    // 客户等级
    levelItems() {
      return this.fieldItems.filter(i => i.id === 29);
    }
  },
  methods: {
    getData(id) {
      this.$emit('getData', id);
    }
  }
};
</script>

<style lang="scss" scoped>
.customer-setting-container {
  background-color: #fff;
  padding: 5px 24px;
  min-height: calc(100vh - 80px);
}
</style>
